<template>
    <div id="app">
        <Nav v-on:switchPage="switchPage"></Nav>
<!--        <Join class="join"></Join>-->
        <router-view></router-view>
<!--        <AddGoods></AddGoods>-->
    </div>
</template>

<script>
    // import Join from './components/Join.vue'
    import Nav from "./components/Nav";
    // import AddGoods from "./components/AddGoods";
    import router from "./router"

    export default {
        router,
        name: 'App',
        components: {
            Nav,
            // Join
            // AddGoods
        },
        data() {
          return {
              url: '/join'
          }
        },
        methods: {
            switchPage(url) {
                if(url !== this.url) {
                    this.url = url
                    this.$router.push(url)
                }
            }
        }
    }
</script>

<style>
    #app {
        font-family: Avenir, Helvetica, Arial, sans-serif;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        width: 100%;
        height: 100%;
    }

    .join {
        margin-top: 50px;
        margin-left: 10%;
        margin-right: 10%;
    }
</style>
